<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.augmentum.login.Constants"%>
<%@ page import="java.util.ArrayList"%>
<%@ page import="java.util.*"%>
<%@ page import="com.augmentum.login.util.Prop"%>
<%
    String basePath = request.getContextPath();
%>
<script type="text/javascript">
  $(document).ready(function(){
      
      $("#minId").hide();
      $("#minId").html(getMin());
      $("#hourId").html(getHour());
      
      $("#hourId").change(function(){
          $("#minId").show();
          $(this).hide();
      });;
      
      $("input[name='questionCount']").focusout(function(){
          var value1 = $("input[name='questionScore']").val();
          var value2 = $(this).val();
          if (value1 && value2) {
              var obj = $("input[name='totalScore']")
              obj.val(value1 * value2);
          }
          
      });
      $("input[name='questionScore']").focusout(function(){
          var value = $("input[name='questionCount']").val();
          if (this.value  && value) {
              var obj = $("input[name='totalScore']")
              obj.val(value * this.value);
          }
      });

      $("#submitId").click(function(){
          var count = $("input[name='questionCount']").val();
          var url = '<%= basePath%>' + "/page/exam/checkQuestionCount/" + count;
          $.get(url, function(data){
              if(data) {
                  $("#createForm").submit();
                  return;
              } else {
                  showDialog(2,2);
              }
          });

          $("#validateCountId").click(function(){
              $("input[name='state']").val("0");
              $("#createForm").submit();
            });
      });
     /* $("textarea[name='description']").bind({
          blur:function() {
              $(this).css("background-color","#FFFFFF")
              if (!reg['noneempty02'].test($(this).val())) {
                 $(this).parent().next().text("Data length is error!");
             } else {
                 $(this).parent().next().text("It's ok!");
             }
          }
      });

       $("input[id='option']").bind({
         blur:function(){
             $(this).css("background-color","#FFFFFF")
             if (!reg['noneempty01'].test($(this).val())) {
                 var obj = $(this).parent().next();
                 obj.text("data length is error!");
                 obj.css('color','#FF3333');
             } else {
                 obj.css('color','#AAFFEE');
                 obj.html("It's ok!");
             }
         }
     });
      }); */
  });
  </script>
<div class="edit common border-style">
<div class="common float-left common-height" style="width:30%"></div>
<form id="createForm" action="<%=basePath%>/page/exam/create" method="post">
<div id="examDivId" class="common float-left common-height" style="width:60%">
    <div class="common common-width">
      <div class="float-left" style="width:20%">
        <label class="color-style04 font-style03" >Exam Name:*</label>
      </div>
      <div class="float-left" style="width:65%">
        <input type="hidden" value="1" name="state" />
        <input class="border-style01" style="height:30px;width:90%" type="text" name="name" />
      </div>
    </div>
    <div class="common common-width">
      <div class="float-left" style="width:20%">
        <label class="color-style04 font-style03">Description:</label>
      </div>
      <div class="float-left" style="width:65%">
        <textarea style="height:50px;width:90%;resize:none" class="border-style01 common-width" name="description"></textarea>
      </div>
    </div>
    <div class="common common-width">
      <div class="float-left" style="width:20%">
        <label class="color-style04 font-style03">Effective Time:*</label>
      </div>
      <div class="float-left" style="width:65%">
        <div>
          <span class="float-left"><input readonly onfocus="c.showMoreDay = false;c.show(this);" class="border-style01" placeholder="Select the date" style="height:28px;margin-right:15px" name="beginDate" /></span>
          <span class="float-left">
            <select id="hourId" class="border-style01" style="height:28px;width:70px" name="beginHour"></select>
            <select id="minId" class="border-style01" style="height:28px;width:70px" name="beginMin"></select>
          </span>
        </div>
      </div>
    </div>
    <div class="common common-width">
      <div class="float-left" style="width:20%"><label class="color-style04 font-style03">Duration</label></div>
      <div class="float-left" style="width:65%">
        <select class="border-style01" style="width:80px;height:27px" name="duration">
          <option value="10">10</option>
          <option value="20">20</option>
          <option value="30">30</option>
          <option value="40">40</option>
          <option value="10">50</option>
          <option value="20">60</option>
          <option value="30">70</option>
          <option value="40">80</option>
          <option value="10">90</option>
          <option value="20">100</option>
        </select>
        <span>min</span>
      </div>
    </div>
    <div class="common common-width color-style04 font-style03">
      <div class="float-left" style="width:20%"><label>Question Setting:<span class="color-style07">*</span></label></div>
      <div class="float-left" style="width:65%">
        <div id="questionScoreId01" class="float-left">
          <span class="float-left" style="width:120px">Question Quantity</span>
          <span class="float-left"><input style="width:70px;height:25px" class="border-style01" name="questionCount" /></span>
          <span class="float-left" style="width:120px">Question Point</span>
          <span class="float-left"><input style="width:70px;height:25px" class="border-style01" name="questionScore" /></span>
        </div>
        <div id="questionScoreId02" class="float-left">
          <span class="float-left" style="width:120px">Total Score</span>
          <span class="float-left"><input readonly style="width:70px;height:25px" class="border-style01" name="totalScore" /></span>
          <span class="float-left" style="width:120px">Pass Criteria</span>
          <span class="float-left"><input style="width:70px;height:25px" class="border-style01" name="criteria" /></span>
        </div>
      </div>
    </div>
    <div class="common common-width">
      <div class="float-left common-height" style="width:16%"></div>
      <div class="float-left common-height" style="width:16%">
        <input id="submitId" class="validateCount bgcolor-style02 border-style01 color-style03" style="width:100px;height:28px;border:0" value="Submit" type="button"/>
      </div>
      <div class="float-left common-height" style="width:16%"></div>
      <div class="float-left common-height" style="width:16%">
        <input onclick="javascript:location.href='<%= basePath%>/page/exam/search'" class="bgcolor-style02 border-style01 color-style03" style="width:100px;height:28px;border:0" type="button" value="Cancel" />
      </div>
      <div class="float-left common-height" style="width:16%"></div>
      <div class="float-left common-height" style="width:16%"></div>
    </div>
</div>
</form>
<div  class="common float-left common-height" style="width:10%;"></div>
</div>
<jsp:include page="../count-validate.jsp"></jsp:include>
<script>
  var c = new Calendar("c");
  document.write(c);
  $("div.edit").height($("body").height()-$("#topId").height());
</script>